/**
 * suggestion menu
 * 结构:
 * <div id=''>
 * 		<input class="smenu-input" />
 * 		<button class="smenu-btn" />
 * 		<div class="smenu-wrap">
 * 			<ul><li></li>...</ul>
 * 		</div>
 * </div>
 * @param
 * options = {
 * 		backend: 'fshared/youtube', //default to youtube
 * 		defaultValue: '',
 * 		defaultColor: '',
 * 		normalColor: '',
 * 		selectedClass: 'suggestion-selected-li'
 * }
 * @author  tanggf
 */


//因为4shared.com回调函数写死, 所以一个页面一般只使用一个4shared相关的suggestion api
var fscallback = null;
var ajaxSuggestions = {};
ajaxSuggestions.jsonpCallback = function(data){
	var items = data.suggestions;
	fscallback(items);
};

(function($){
	$.fn.smenu = function(options){
		//default setting
		options = $.extend({
			backend: 'youtube',
			defaultValue: '',
			defaultColor: '#DDDDDD',
			normalColor: '#666666',
			googleUrl: 'http://suggestqueries.google.com/complete/search',
			fsharedUrl: 'http://www.4shared.com/network/search-suggest.jsp?format=jsonp',
			selectedClass: 'suggestion-selected-li',
			onchange: function(value){			
			}
		}, options);
		
		return this.each(function(){			
			var $this = $(this);
			var $input = $this.children("input.smenu-input");
			var $btn = $this.children("button.smenu-btn");
			var $wrap = $this.children("div.smenu-wrap");			
			
			var _smenu_ = {
					reset: function($lis){
						this.$lis = $lis;
						this.index = 0;
						this.length = this.$lis.length;
					},
					down: function(fn){
						if(this.index + 1 >= this.length){
							this.index = 0;			
						}else{						
							this.index += 1;
						}
						fn(this.$lis, this.index);
					},
					up: function(fn){
						if(this.index - 1 < 0){
							this.index = this.length - 1;
						}else{
							this.index -= 1;
						}
						fn(this.$lis, this.index);		
					}
			};
			
			var value = $input.val();
			if(value != options.defaultValue){
				$input.css({color: options.normalColor});
			}
			
			$btn.click(function(){
				var value = $input.val().trim();
				if(value && value != options.defaultValue){
					options.onchange(value);
				}
			});
			
			$input.focus(function(){
				$input.select();
				var value = $input.val();
				if(value == options.defaultValue){
					$input.val("").css({color: options.normalColor});
				}
			}).blur(function(){
				var value = $input.val().trim();
				if( ! value){
					$input.val(options.defaultValue).css({color: options.defaultColor});
				}else{
					$input.css({color: options.normalColor});
				}
				$wrap.hide();
			}).keyup(function(event){
				var query = $input.val().trim();
				if(query == ''){
					$wrap.hide();
					return;
				}				
				var which = event.which;
				if(which == 13){
					options.onchange(query);				
				}else if(which == 38){
					if($wrap.is(":hidden")){
						$wrap.show();
					}else{
						_smenu_.up(function($lis, index){
							var text = $lis.removeClass(options.selectedClass).eq(index).addClass(options.selectedClass).text();
							$input.val(text);
						});
					}
				}else if(which == 40){
					if($wrap.is(":hidden")){
						$wrap.show();
					}else{
						_smenu_.down(function($lis, index){
							var text = $lis.removeClass(options.selectedClass).eq(index).addClass(options.selectedClass).text();
							$input.val(text);
						});
					}
				}else if(which >= 48 || which == 8 || which == 46){
					if(options.backend == 'fshared'){
						__handle_4shared_suggestion(query);
					}else{
						__handle_go_suggestion(query);
					}					
				}							
			});
			
			function __handle_go_suggestion(query){				
				$.ajax({
					url: options.googleUrl,
					dataType: "jsonp",
					data: {hl: "en",client: "youtube",	hjson: "t",	ds: "yt",	cp: "3",	q: query},
					success: function(data) {
						var items = data[1];
						if(items.length > 0){
							var arrs = [];
							$.each(items, function(i, value){
								arrs.push(value[0]);
							});							
							___handle_result_(query, arrs);
						}
					}
				});
			}
			
			function __handle_4shared_suggestion(query){			
				var url = options.fsharedUrl;
				url += "&search=" + utils.base64Encode(query);
				$.ajax({url: url, dataType: "jsonp"});
				fscallback = function(items){
					if(items.length > 0){
						___handle_result_(query, items);
					}
				};
			}
			
			function ___handle_result_(query, items){
				var html = "<ul><li style=\"display:none\">" + query + "</li>";			
				$.each(items, function(i, value){							
					html += "<li>" + value + "</li>";
				});
				html += "</ul>";
				$wrap.html(html).show();
				var $lis = $("ul > li", $wrap);
				_smenu_.reset($lis);
				$lis.mousedown(function(){
					var value = $(this).text();
					$input.val(value);
					$wrap.hide();
					options.onchange(value);
				}).hover(function(){
					$lis.removeClass(options.selectedClass);
					$(this).addClass(options.selectedClass).css({
						cursor: 'default'
					});
				});
			}
		});
	};			
})(jQuery);